import { FC } from 'react';

import classNames from 'classnames';

const PageLoading: FC<{ visible: boolean; className?: string }> = ({ visible, className = '' }) => {
  return (
    <div
      className={classNames({
        'top-0 left-0 z-[24] flex flex-col justify-center items-center w-[100vw] h-[100vh]': true,
        fixed: visible,
        hidden: !visible,
        [className]: true,
      })}
      style={{ backgroundColor: 'rgba(0, 0, 0, 0.8)' }}
    >
      <img src={JL_APP_CONTEXT.source.loadingLogo} className="w-[156px]" />
    </div>
  );
};

export default PageLoading;
